<template>
	<view class="content">
		<!-- <hxNavbar :config="config"></hxNavbar> -->
		<view class="content_box">
			<!-- 轮播图 -->
			<view class="swiper_box">
				<swiper class="swiper" indicator-active-color="#fff" circular :indicator-dots="true" :autoplay="true"
					:interval="2000" :duration="500">
					<swiper-item v-for="(swiperitem,swiperindex) in dataList.good_item.good_carousel" :key="swiperindex">
						<image class="swiperimg" :src="swiperitem"
							mode="">
						</image>
					</swiper-item>
<!-- 					<swiper-item>
						<image class="swiperimg" src="https://yuanchubao.oss-cn-beijing.aliyuncs.com/banner.png"
							mode="">
						</image>
					</swiper-item>
					<swiper-item>
						<image class="swiperimg" src="https://yuanchubao.oss-cn-beijing.aliyuncs.com/banner.png"
							mode="">
						</image>
					</swiper-item> -->
				</swiper>
				<view class="left_icon" :style="{top:statusBarHeight+20+'px'}" @click="leftback">
					<image class="left_backicon" src="../../static/imgs/left_back.png" mode=""></image>
				</view>
				<view class="huodong_box" v-if="dataList.good_item.is_activity==1">
					<view class="huodong_boxL">
						<view class="huodong_info">
							<view class="huodong_boxLtxt1">原价:￥{{dataList.good_item.origin_price}}</view>
							<view class="huodong_boxLtxt">现拼单价:￥{{dataList.good_item.now_price}}</view>
							

						</view>
						<view class="huodong_info1">
							<!-- <view class="huodong_boxLtxt1">已售:{{dataList.good_item.competed_sale_num}}</view> -->
							<view class="huodong_boxLtxt2"> </view>
							<view class="huodong_boxLtxt">拼单最低价:￥{{dataList.good_item.low_price}}</view>
						</view>

					</view>
					<view class="huodong_boxR">
						<view class="huodong_boxRicon">
							<view class="huodong_boxRiconL">
								<van-icon name="clock" v-show="!isshowtime" color="#EF0E6C" size="16" />
								<van-icon name="warning" v-show="isshowtime" color="#FFF100" size="16"/>
							</view>
							<view class="huodong_boxRiconR">结束时间</view>
						</view>
						<view class="huodong_boxRtime">
							<!-- <van-count-down class="van_time" auto-start use-slot :time="time" @change="onChange">
								<text class="item" :class="isshowtime?'item_active':''">{{ timeData.hours }}</text><text class="item_icon">:</text>
								<text class="item" :class="isshowtime?'item_active':''">{{ timeData.minutes }}</text><text class="item_icon">:</text>
								<text class="item" :class="isshowtime?'item_active':''">{{ timeData.seconds }}</text>
							</van-count-down> -->
							
							<view class="time">
									<view class="shijian" :class="isshowtime?'item_active':''">{{countdownh}}</view>
									<text>:</text>
									<view class="shijian" :class="isshowtime?'item_active':''">{{countdownm}}</view>
									<text>:</text>
									<view class="shijian" :class="isshowtime?'item_active':''">{{countdowns}}</view>
							</view>
						</view>
					</view>
				</view>
				<view class="huodong_boxone" v-else>
					原价:￥{{dataList.good_item.origin_price}}
				</view>
			</view>
			<view class="huodongguizebox" v-if="dataList.good_item.is_activity==1">
				<view class="huodongguizeboxT" v-if="dataList.rule_item!==''">
					<view class="huodongguizeboxTTitle">{{dataList.rule_item.attr_type_txt}}规则： </view>
					<view class="huodongguizeboxTTxt" v-for="(ruleitem,ruleindex) in dataList.rule_item.rule_txt" :key="ruleindex"> {{ruleitem}} </view>
<!-- 					<view class="huodongguizeboxTTxt"> 本商品销售数量满20件，每件商品单件减5元。 </view>
					<view class="huodongguizeboxTTxt"> 本商品销售数量满20件，每件商品单件减5元。 </view> -->
				</view>
				<view class="huodongguizeboxB" v-if="dataList.other_item.txt!==''">{{dataList.other_item.txt}}</view>
			</view>
			<view class="huodongchangebox">
				<view class="huodongchangetitle">{{dataList.good_item.title}}</view>
				<view class="huodongchange" @click="openchange">
					<view class="huodongchangeL">商品编码</view>
					<view class="huodongchangeR2">{{dataList.good_item.code}}
						
					</view>
					
				</view>
				<view class="huodongchange1" @click="openchange">
					<view class="huodongchangeL">规格/颜色</view>
					<view class="huodongchangeR" :class="guigevalue=='未选择'?'':'huodongchangeR1'">{{guigevalue}}
						
					</view>
					<van-icon class="righticon" name="arrow" size="16" color="#999" />
				</view>
				<button class="huodongchange1" open-type="share" @click="share">
					<!-- <view class="huodongchangeL">分享</view> -->
					<!-- <view class="huodongchangeR">
						
					</view> -->
					分享
					<image class="fenxiangimg" :src="imgurl+'fximgicon.png'" mode=""></image>
					<!-- <van-icon class="righticon" name="arrow" size="16" color="#999" /> -->
				</button>
			</view>
			<view class="swiperinfo_box" v-if="dataList.order_item && dataList.order_item.length>0">
				<swiper autoplay :interval="2000" :duration="1000" disable-touch="true" vertical circular :display-multiple-items="swiperlength">
					<swiper-item class="swiperinfoitem" v-for="(orderitem,orderindex) in dataList.order_item" :key="orderindex">
						<view class="swiperinfotxt">{{orderitem.buy_time}} {{orderitem.name}}，{{orderitem.txt}}</view>
					</swiper-item>
			
				</swiper>
			</view>
			<view class="store_infotitle">
				商家承诺:{{dataList.other_item.txt_1}}
				
			</view>
			<view class="store_itembox">
				<view class="store_item" v-for="(txtitem,txtindex) in dataList.other_item.txt_2" :key="txtindex">{{txtitem}} </view>
			<!-- 	<view class="store_item">免费送货 </view>
				<view class="store_item">免费送货 </view> -->
			</view>
		<!-- 	<view class="yunfei_info">
				<view class="yunfei_infoT">{{dataList.other_item.txt_3}} </view>
				<view class="yunfei_infoB">*{{dataList.other_item.txt_4}}</view>
			</view> -->
			<view class="videobox" v-if="dataList.good_item.good_video_url!==''">
				<video class="myVideo" show-mute-btn autoplay muted loop :src="dataList.good_item.good_video_url"></video>
			</view>
			<view class="shops_detailbox">
				<view class="shops_detailtitle">
					<view class="shops_detailtitleL"></view>
					<view class="shops_detailtitleR">详情</view>
					<view class="shops_detailtitleL"></view>
				</view>
				<!-- <view class="shops_detail_imgs" v-html="dataList.good_item.good_content"></view> -->
				<view class="shops_detail_imgs" v-html="dataList.good_item.good_content">
					<rich-text perview image-menu-prevent :nodes="dataList.good_item.good_content"></rich-text>
				</view>
				
			</view>
		</view>
		<view class="shopdetail_bottom1">
			
		</view>
		<view class="shopdetail_bottom" :class="dataList.good_item.is_activity==1?'':''">
			<view class="store_box" @click="goshouye">
				<!-- <view class="store_boxicon"> -->
					<image class="store_boxicon" :src="imgurl+'shouyeicon.png'" mode=""></image>
				<!-- </view> -->
				<view class="store_boxtxt">首页</view>
			</view>
			<view class="store_box" @click="gostoredetail(dataList.good_item)">
				<!-- <view class="store_boxicon"> -->
					<image class="store_boxicon" :src="imgurl+'store_icon1.png'" mode=""></image>
				<!-- </view> -->
				<view class="store_boxtxt">店铺</view>
			</view>
<!-- 			<view class="kefubox">
					<image class="kefuboxicon" :src="imgurl+'lianxikefuicon.png'" mode=""></image>
				<view class="kefuboxtxt">客服</view>
			</view> -->
			<button class="content_setup" open-type="contact" session-from="weapp" style="padding: 0; margin-left: 30rpx; background:transparent" @click="lianxikefu">
				<image class="kefuboxicon" :src="imgurl+'lianxikefuicon.png'" mode=""></image>
				<view class="kefuboxtxt">客服</view>
			</button>
			<view class="cartbox">
				<view class="cartboxL" @click="opencart(2)">加购物车
				<view class="cart_icon" v-if="cartnum!==0">{{cartnum}}</view>
				</view>
				<view class="cartboxR" @click="opencart(1)">立即购买</view>
			</view>
			<view class="pintuan" v-if="dataList.good_item.is_activity==1" @click="opencart(3)">参与拼单</view>
		</view>
		<!-- 选择规格弹出层规格 -->
		<van-popup :show="isshowguige" :close-on-click-overlay="true" round position="bottom" closeable  @close="onClosepopup">
			<view class="popupbox">
				<view class="popupbox_top">
					<view class="popupbox_topL">
						<image class="popupbox_topL1" :src="changespeclist.good_item_img" mode=""></image>
					</view>
					<view class="popupbox_topR">
						<view class="popupbox_topRtitle">已选:{{changespeclist.spec_title}}</view>
						<view class="popupbox_topRtxt">(库存：剩{{changespeclist.stock}}件)    &nbsp;&nbsp;&nbsp;已销售{{changespeclist.sale_num}}件</view>
						<view class="popupbox_topRbottom">
							<view class="popupbox_topRbottomL"><text class="popupbox_topRbottomprice">￥</text>{{now_price}}</view>
							<view class="popupbox_topRNUM">
								<view class="cart_reduce" @click="reduce_cartnum">-</view>
								<view class="cart_input">
									<input class="num_input" :value="numvalue" type="number" @input="cartnuminput">
								</view>
								<view class="cart_add" @click="add_cartnum">+</view>
							</view>
						</view>
					</view>
				</view>
				<view class="popup_kong"></view>
				<view class="changestylebox">
					<view class="change_boxtop">外观</view>
					<view class="line"></view>
					<view class="changebox">
						<view class="changeboxitem " :class="changespec==specitem.good_sku?'changeboxitem_active':''" @click="onchangespec(specitem)" v-for="(specitem,specindex) in dataList.spec_item" :key="specindex">{{specitem.spec_title}}</view>
					<!-- 	<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view> -->
					</view>

					<view class="changebtn" @click="onconfirmguige(1)">确认</view>
					<view class="changebtnbottom"></view>
				</view>
			</view>
		</van-popup>
		
		<!-- 加入购物车规格弹窗 -->
		<van-popup :show="isshowguigecart" :close-on-click-overlay="true" round position="bottom" closeable  @close="onClosepopupcart">
			<view class="popupbox">
				<view class="popupbox_top">
					<view class="popupbox_topL">
						<image class="popupbox_topL1" :src="changespeccartlist.good_item_img" mode=""></image>
					</view>
					<view class="popupbox_topR">
						<view class="popupbox_topRtitle">已选:{{changespeccartlist.spec_title}}</view>
						<view class="popupbox_topRtxt">(库存：剩{{changespeccartlist.stock}}件)    &nbsp;&nbsp;&nbsp;已销售{{changespeccartlist.sale_num}}件</view>
						<view class="popupbox_topRbottom">
							<view class="popupbox_topRbottomL" v-if="froms==1"><text class="popupbox_topRbottomprice">￥</text>{{origin_pricecart}}</view>
							<view class="popupbox_topRbottomL" v-else><text class="popupbox_topRbottomprice">￥</text>{{now_pricecart}}</view>
							<view class="popupbox_topRNUM">
								<view class="cart_reduce" @click="reduce_cartnumcart">-</view>
								<view class="cart_input">
									<input class="num_input" :value="numvaluecart" type="number" @input="cartnuminputcart">
								</view>
								<view class="cart_add" @click="add_cartnumcart">+</view>
							</view>
						</view>
					</view>
				</view>
				<view class="popup_kong"></view>
				<view class="changestylebox">
					<view class="change_boxtop">外观</view>
					<view class="line"></view>
					<view class="changebox">
						<view class="changeboxitem " :class="changespeccart==specitemcart.good_sku?'changeboxitem_active':''" @click="onchangespeccart(specitemcart)" v-for="(specitemcart,specindexcart) in dataList.spec_item" :key="specindexcart">{{specitemcart.spec_title}}</view>
					<!-- 	<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view>
						<view class="changeboxitem">原味4+烧烤4+青柠4+红烩4 ￥72.0 </view> -->
					</view>
		
					<view class="changebtn" @click="onconfirmcart">确认</view>
					<view class="changebtnbottom"></view>
				</view>
			</view>
		</van-popup>
		
	</view>

</template>

<script>
	import {getGoodDetailByCode,addCart,getAllCartNumByToken} from '../../utils/app.js'
	let timer = require('../../utils/wxTimer.js');
	export default {
		components: {},
		data() {
			return {
				time: 5 * 24 * 60 * 60 * 1000,
				timeData: {
					hours:72,
					minutes:60,
					seconds:60
				},
				countdownh:'',
				countdownm:'',
				countdowns:'',
				timer: null, //重复执行
				imgurl: getApp().globalData.imgurl,
				scrollTop:'',
				isshowtime:false,//时间控制显示
				isshowguige:false, //规格弹窗显示
				numvalue:1, // 选择规格数量数量
				numvaluecart:1, // 选择加入购物车数量
				codeid:'', // code值上一页传的
				dataList:{}, // 数据信息
				swiperlength: null, // 滚动数据长度
				changespec:'',// 选中的规格
				changespecNum:'',// 选中的规格数量
				changespeclist:{}, // 选中规格数据
				guigevalue:'未选择', // 选择规格
				now_price:null, // 选择数量后的价格
				now_pricecart:null, // 选择数量后的价格购物车
				origin_pricecart:null, // 选择数量后的价格购物车立即购买的
				isshowguigecart:false,// 加入购物车弹窗
				changespeccart:'',// 选中的规格购物车
				changespeccartlist:{}, // 选中规格数据购物车
				froms:'', // 选择加入购物车还是立即购买还是参与拼团1是立即购买2是加入购物车3是参与拼团
				cartnum:0, // 购物车数量
				end_time:'', // 结束时间
				api_token: uni.getStorageSync('token'),
				list:[
					{buy_time:'2023-8-1',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},
					{buy_time:'2023-8-2',name:'v阿桑的歌哈桑',txt:'啊u酒店宾馆AUYS'},

				],
				statusBarHeight:null,
				ischange: '', // 是否选择了规格
				// timer: {
				//         remaining: '00:00:00'     }
			}
		},
		onLoad(options) {
			uni.showToast({
				title:'加载中',
				icon:'loading',
			})
			this.codeid=options.codeid
			console.log(uni.getSystemInfoSync().statusBarHeight);
			this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
			
			this.getList()
			this.getcartnum()
			console.log(this.end_time);
			
				this.timer = setInterval(()=>{
						this.showtime(this.end_time)
					},1000)
				
			// this.onChange()
			
		},
		onShow() {

		},
		methods: {
			
			//跳转到首页
			goshouye(){
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
			
			// 点击进入店铺详情
			gostoredetail(e){
				console.log(e);
				uni.navigateTo({
					url:'/pages/storeDetail/storeDetail?storeid='+e.store_id
				})
			},
			
			    showtime (itme) {
					// console.log('11111111');
							var nowtime = new Date(),  //获取当前时间
							endtime = new Date(itme);  //定义结束时间
							var lefttime = itme*1000 - nowtime.getTime(),  //距离结束时间的毫秒数
							leftd = Math.floor(lefttime/(1000*60*60*24)),  //计算天数
							lefth = Math.floor((lefttime/(1000*60*60)%24)+leftd*24) < 10 ? "0" + Math.floor((lefttime/(1000*60*60)%24)+leftd*24) : Math.floor((lefttime/(1000*60*60)%24)+leftd*24),  //计算小时数
							leftm = Math.floor(lefttime/(1000*60)%60) < 10 ? "0" + Math.floor(lefttime/(1000*60)%60) : Math.floor(lefttime/(1000*60)%60),  //计算分钟数
							lefts = Math.floor(lefttime/1000%60) < 10 ? "0" + Math.floor(lefttime/1000%60) : Math.floor(lefttime/1000%60);  //计算秒数
							this.countdownh = lefth  //返回倒计时的字符串
							this.countdownm = leftm//返回倒计时的字符串
							this.countdowns = lefts  //返回倒计时的字符串
							// 倒计时结束时，显示00:00:00
							// console.log('--------------------');
							// console.log(this.countdownh);
							// console.log(this.countdownm);
							// console.log(this.countdowns);
							if(lefttime < 0) {
								this.countdownh = this.countdownm= this.countdowns = "00"
							}
							if(lefth==0 && leftm<=30){
								this.isshowtime = true
							}
						},
			// 获取购物车数量
			getcartnum(){
				console.log(this.api_token);
				if(!this.api_token){
					this.cartnum=0
				} else {
					getAllCartNumByToken({
					}).then(res => {
						console.log(res);
						console.log(res.data!=='');
						if(res.data!==''){
							this.cartnum = res.data.all_cart_num
						}else {
							this.cartnum=0
						}
						console.log(this.cartnum);
					
					})
				}
				
			
			},
			// 点击加入购物车
			onconfirmcart(){
				console.log(this.froms);
				if(this.froms==1){
					this.isshowguigecart = false
					addCart({
						good_sku:this.changespeccart,
						cart_num:this.numvaluecart,
						froms:1
					}).then(res => {
						console.log(res);
						if(res.code==1){
							uni.navigateTo({
								url:'/pages/confirmOrder/confirmOrder?cartids='+res.data.cart_id+'&froms='+1
							})
						} else {
							uni.showToast({
								title:res.info,
								icon:'none',
								duration:1000
							})
							if(res.info=='请先登录'){
								setTimeout(function(){
									uni.navigateTo({
										url: '/pages/subPack/Login/Login'
									})
								},1000)
							}
						}

					})
				} else if(this.froms==2){
					this.isshowguigecart = false
					addCart({
						good_sku:this.changespeccart,
						cart_num:this.numvaluecart,
						froms:2
					}).then(res => {
						console.log(res);
						if(res.code==1){
						this.cartnum = res.data.all_cart_num
						}else {
							uni.showToast({
								title:res.info,
								icon:'none',
								duration:1000
							})
							if(res.info=='请先登录'){
								setTimeout(function(){
									uni.navigateTo({
										url: '/pages/subPack/Login/Login'
									})
								},1000)
							}
						}
					
					
					})
				} else if(this.froms==3){
					this.isshowguigecart = false
					addCart({
						good_sku:this.changespeccart,
						cart_num:this.numvaluecart,
						froms:3
					}).then(res => {
						console.log(res);
						if(res.code==1){
							uni.navigateTo({
								url:'/pages/confirmOrder/confirmOrder?cartids='+res.data.cart_id+'&froms='+3
							})
						} else {
							uni.showToast({
								title:res.info,
								icon:'none',
								duration:1000
							})
							if(res.info=='请先登录'){
								setTimeout(function(){
									uni.navigateTo({
										url: '/pages/subPack/Login/Login'
									})
								},1000)
							}

						}
					
					})
				}
				
			},
			// 购物车数量加一
			add_cartnumcart(){
				this.numvaluecart++
				this.now_pricecart = (this.numvaluecart * this.changespeccartlist.now_price).toFixed(2)
				this.origin_pricecart = (this.numvaluecart * this.changespeccartlist.origin_price).toFixed(2)
				console.log(this.now_pricecart);
			},
			// 购物车数量输入
			cartnuminputcart(e){
				// console.log(e.detail.value);
				this.numvaluecart = e.detail.value
				this.now_pricecart = (this.numvaluecart * this.changespeccartlist.now_price).toFixed(2)
				this.origin_pricecart = (this.numvaluecart * this.changespeccartlist.origin_price).toFixed(2)
			},
			// 购物车商品数量减一
			reduce_cartnumcart(){
				this.numvaluecart--
				
				if(this.numvaluecart<=0){
					this.numvaluecart = 1
				}
				this.now_pricecart = (this.numvaluecart * this.changespeccartlist.now_price).toFixed(2)
				this.origin_pricecart = (this.numvaluecart * this.changespeccartlist.origin_price).toFixed(2)
				
			},
			// 打开购物车选择规格弹窗
			opencart(e){
				
				if(this.ischange==''){
					this.froms = e
					this.isshowguigecart = true
					this.changespeccart = this.dataList.spec_item[0].good_sku
					this.changespeccartlist = this.dataList.spec_item[0]
					this.now_pricecart = this.dataList.spec_item[0].now_price
					this.origin_pricecart = this.dataList.spec_item[0].origin_price
					this.numvaluecart =1
				}else{
					console.log(this.changespeclist);
					console.log(this.dataList.spec_item);
					let fx = this.dataList.spec_item.findIndex(item=>{
						return item.good_sku == this.changespec
					})
					console.log(fx);
					this.changespeccart = this.dataList.spec_item[fx].good_sku
					this.froms = e
					this.isshowguigecart = true
					this.changespeccartlist = this.dataList.spec_item[fx]
					this.now_pricecart = this.dataList.spec_item[fx].now_price*this.changespecNum
					this.origin_pricecart = this.dataList.spec_item[fx].origin_price*this.changespecNum
					this.numvaluecart = this.changespecNum
				}

			},
			// 加入购物车选择规格
			onchangespeccart(item){
				console.log(item);
				this.changespeccart = item.good_sku
				this.changespeccartlist = item
				this.now_pricecart = item.now_price
				this.origin_pricecart = item.origin_price
				this.numvaluecart =1
			},
			// 购物车弹窗关闭
			onClosepopupcart(){
				this.isshowguigecart = false
			},
			
			
			// 点击确认选择规格
			onconfirmguige(e){
				console.log(e);
				this.ischange = e
				this.isshowguige = false
				this.guigevalue = this.changespeclist.spec_title
				this.changespecNum = this.numvalue
				// console.log(this.guigevalue);
			},
			// 选择规格
			onchangespec(item){
				console.log(item);
				this.changespec = item.good_sku
				this.changespeclist = item
				this.now_price = item.now_price
				this.numvalue = 1
			},
			// 获取数据
			getList(){
				getGoodDetailByCode({
					code: this.codeid
				}).then(res => {
					uni.hideToast()
					console.log(res);
					res.data.good_item.good_carousel = res.data.good_item.good_carousel
					this.dataList = res.data
					this.swiperlength =res.data.order_item.length>=6? 5:res.data.order_item.length
					// this.swiperlength =this.list.length>=6? 5:this.list.length
					// this.end_time = res.data.good_item.end_time
					this.end_time = res.data.good_item.invalid_time
					var richtext = this.dataList.good_item.good_content
					const regex = new RegExp('<img','gi');
					richtext = richtext.replace(regex,`<img style="max-width:100%;"`)
					this.dataList.good_item.good_content = richtext
					
					
					
					console.log(this.dataList);
				// let wxTimer = new timer({
				//     expired_at: "2023-8-27 23:28:00.14756",
				//     complete: function () {
				//         console.log("完成了")
				//     },
				//     expired: function () {
				//         console.log("过期了(结束时间小于当前时间)")
				//     },
				// })
				// console.log(wxTimer);
				// wxTimer.start(this);
				// wxTimer.stop();
				// console.log(this.timer.remaining);
				
				})
			},
			// 跳转到确认订单页面
			onconfirmOrder(){
				uni.navigateTo({
					url:'/pages/confirmOrder/confirmOrder'
				})
			},
			// 分享
			// share(){
				
			// },
			
			// 打开选择规则弹窗
			openchange(){
				this.isshowguige = true
				if(this.ischange==''){
					this.changespec = this.dataList.spec_item[0].good_sku
					this.changespeclist = this.dataList.spec_item[0]
					this.now_price = this.dataList.spec_item[0].now_price
					
					this.numvalue =1
				} else {
					
				}
				
			},
			// 购物车数量加一
			add_cartnum(){
				this.numvalue++
				this.now_price = (this.numvalue * this.changespeclist.now_price).toFixed(2)
				console.log(this.now_price);
			},
			// 购物车数量输入
			cartnuminput(e){
				// console.log(e.detail.value);
				this.numvalue = e.detail.value
				this.now_price = (this.numvalue * this.changespeclist.now_price).toFixed(2)
			},
			// 购物车商品数量减一
			reduce_cartnum(){
				this.numvalue--
				
				if(this.numvalue<=0){
					this.numvalue = 1
				}
				this.now_price = (this.numvalue * this.changespeclist.now_price).toFixed(2)
				
			},
			// 关闭弹窗
			onClosepopup(){
				// console.log(1);
				this.isshowguige=false
			},
			
			// startMessageTimer() {
			// 	clearInterval(this.interval); 
			// 	let viewData = this.$refs.scroll;
			// 	this.interval = setInterval(() => {
			// 	this.scrollTop += 1;
			//   }, 200);
			// },
			 
			// scrolltolower() {
			// 	this.scrollTop = 0;
			// },

			onChange() {
				console.log(this.countdownh);
				// if(this.countdownh==0 && this.countdownm<=30){
				// 	this.isshowtime = true
				// }
				// this.setData({
				// timeData: e.detail,
				// });
			},
			// 返回按钮箭头
			leftback() {
				uni.navigateBack()
			},
		},
		onShareAppMessage: function() { // 分享到微信
		  // 更多参数配置，参考文档
		  return {
		    title: '源初宝',
		    path: '/pages/goodsDetail/goodsDetail?codeid='+this.codeid
		  }
		},
		
		onShareTimeline() { // 分享到朋友圈
		  return {
		    title: '源初宝',
		    path: '/pages/goodsDetail/goodsDetail?codeid='+this.codeid
		  }
		},
	}
</script>

<style>
	page {
		background: #eee;
		width:100%;
		/* overflow:hidden; */
		
	}

	.swiper_box {
		width: 100%;
		height: 498rpx;
		/* background: #000; */
		position: relative;
	}

	.swiper {
		width: 100%;
		height: 100%;
	}

	/* 未激活状态 */
	.swiper .wx-swiper-dot {
		/*inline-flex表示 将对象作为内联弹性伸缩盒显示 等同于给父级元素添加display：flex*/
		/* display: inline-flex; justify-content: space-between; */
		margin-left: 2rpx;
		content: " ";
		width: 6rpx;
		height: 6rpx;
		background: rgba(242, 246, 248, 0.1);
		border-radius: 4rpx;
		border: 1rpx solid rgba(242, 246, 248, 0.1);

	}

	.swiperimg {
		width: 100%;
		height: 100%;
	}

	.left_icon {
		width: 17rpx;
		height: 31rpx;
		position: fixed;
		top: 52rpx;
		left: 30rpx;

	}

	.left_backicon {
		width: 100%;
		height: 100%;
	}

	.huodong_box {
		width: 100%;
		/* height: 114rpx; */
		background: #EF0E6C;
		position: absolute;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;

	}
	.huodong_boxone{
	width: 100%;
	height: 64rpx;
	background: #EF0E6C;
	position: absolute;
	bottom: 0;
	display: flex;
	align-items: center;
	padding-left: 30rpx;
	font-size: 28rpx;
	color: #fff;
	box-sizing: border-box;
	}

	.huodong_boxL {
		padding: 10rpx 0rpx;
		width: 506rpx;
		/* height: 114rpx; */
		display: flex;
		align-items: center;
		justify-content: space-between;

	}

	.huodong_boxR {
		width: 245rpx;
		min-height: 120rpx;
		background: url(https://yuanchubao.oss-cn-beijing.aliyuncs.com/daojishibg.png) no-repeat;
		background-size: contain;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

	}

	.huodong_info {
		margin-left: 30rpx;
	}

	.huodong_boxRicon {
		display: flex;
		align-items: center;
		justify-content: center;
		/* margin-top: 18rpx; */
	}

	.huodong_boxRiconL {
		/* 	width: 30rpx;
		height: 30rpx; */

	}

	.huodong_boxRiconR {
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0101;
		margin-left: 16rpx;
	}

	.huodong_boxRtime {
		/* height: 44rpx; */
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: 12rpx;

	}
	.time{
		display: flex;
		align-items: center;
		margin-left: 15rpx;
		
	}
	.shijian{
		display: inline-block;
		/* display: block; */
		/* width: 44rpx; */
		padding: 0 8rpx;
		height: 44rpx;
		background: #EF0E6C;
		border: 1rpx solid #EF480E;
		box-shadow: 0rpx 2rpx 38rpx 0rpx rgba(16, 5, 10, 0.11);
		border-radius: 5rpx;
		box-sizing: border-box;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 44rpx;
		margin-right: 6rpx;
		margin-left: 6rpx;
		text-align: center;
	}


	/* 	.huodong_boxRsan{
		position: absolute;
		left: -59rpx;
		height: 0;
		width: 0;
		border-top: 60rpx solid  transparent;
		border-left: 30rpx solid transparent;
		border-right: 30rpx solid #FBEBDC;
		border-bottom: 60rpx solid transparent;
	}
	.huodong_boxRfang{
		width: 215rpx;
		height: 120rpx;
		background: linear-gradient(183deg, #FBEBDC 0%, #E5C2A4 100%);
	} */
	.huodong_boxLtxt {
		/* width: 225rpx; */
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 28rpx;
	}

	.huodong_boxLtxt1 {
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 28rpx;
		margin-bottom: 18rpx;
	}
	.huodong_boxLtxt2 {
		height: 28rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 28rpx;
		margin-bottom: 18rpx;
	}

	.item {
		display: inline-block;
		/* display: block; */
		width: 44rpx;
		height: 44rpx;
		background: #EF0E6C;
		border: 1px solid #EF480E;
		box-shadow: 0rpx 2rpx 38rpx 0rpx rgba(16, 5, 10, 0.11);
		border-radius: 5rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 44rpx;
		margin-right: 10rpx;
		margin-left: 15rpx;
		text-align: center;
	}
	.item_active{
			background: #FFF100;
			border: 1rpx solid #B4A608;
			box-shadow: 0rpx 2rpx 38rpx 0rpx rgba(16, 5, 10, 0.11);
			border-radius: 5rpx;
			color: #FF0101;
	}

	.item_icon {
		color: #FF0101;
		text-align: center;
		position: absolute;
		top: 70%;
		transform: translateY(-50%);
	}

	.huodongguizebox {
		width: 690rpx;
		/* height: 500rpx; */
		background: #fff;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 22rpx;
	}

	.huodongguizeboxT {
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333;
		line-height: 40rpx;
		padding: 19rpx;
		box-sizing: border-box;
	}

	.huodongguizeboxTTitle {
		color: #FF0000;
		font-weight: 700;
	}

	.huodongguizeboxTTxt {}

	.huodongguizeboxB {
		width: 690rpx;
		/* height: 103rpx; */
		background: #FF0000;
		border-radius: 10rpx 10rpx 10rpx 10rpx;
		padding: 12rpx 22rpx 28rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 40rpx;
		box-sizing: border-box;
	}

	.huodongchangebox {
		width: 690rpx;
		/* height: 173rpx; */
		background: #FFFFFF;
		border-radius: 10rpx;
		margin: 0 auto;
		margin-top: 20rpx;
		/* margin-bottom: 20rpx; */
	}

	.huodongchangetitle {
		width: 570rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #333333;
		line-height: 45rpx;
		padding: 18rpx 22rpx 15rpx;
		/* 	margin-left: 22rpx;
		margin-top: 18rpx; */
	}

	.huodongchange {
		width: 690rpx;
		/* height: 79rpx; */
		background: #fff;
		border-top: 1rpx solid #eee;
		border-radius: 0rpx 0rpx 10rpx 10rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 24rpx 0;
		position: relative;
	}
	.huodongchange1 {
		width: 690rpx;
		/* height: 79rpx; */
		background: #fff;
		/* border-top: 1rpx solid #eee; */
		border-radius: 0rpx 0rpx 10rpx 10rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* padding: 24rpx 0; */
		position: relative;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
	}

	.huodongchangeL {
		width: 130rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		/* line-height: 69rpx; */
		margin-left: 20rpx;
	}

	.huodongchangeR {
		width: 420rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0000;
		/* line-height: 69rpx; */
		margin-right: 56rpx;
		text-align: right;
/* 		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis; */

	}
	.huodongchangeR1{
		width: 460rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333;
		/* line-height: 69rpx; */
		margin-right: 56rpx;
		text-align: right;
/* 		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis; */
	}
	.huodongchangeR2{
			width: 460rpx;
			font-size: 28rpx;
			font-family: Hiragino Sans GB;
			font-weight: normal;
			color: #333;
			/* line-height: 69rpx; */
			margin-right: 26rpx;
			text-align: right;
	/* 		overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis; */
		}
	.fenxiangimg{
		width: 35rpx;
		height: 33rpx;
		/* margin-right: 25rpx; */
	}

	.righticon {
		position: absolute;
		top: 50%;
		right: 18rpx;
		transform: translateY(-50%);
		/* margin-left: 18rpx; */
	}

	.swiperinfo_box {
		width: 690rpx;
		min-height: 65rpx;
		max-height: 295rpx;
		background: #FFFFFF;
		border-radius: 10rpx;
		padding: 20rpx 20rpx 20rpx;
		box-sizing: border-box;
		margin: 0 auto;
		margin-top: 40rpx;
		box-sizing: border-box;
		overflow: hidden;

	}
	.swiperinfoitem{
		height: 55rpx !important;
		/* line-height: 65rpx !important; */
	}

	.swiperinfotxt {
		/* height: 36rpx; */
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #00A0E9;
		/* line-height: 32rpx; */
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	.store_infotitle{
		width: 100%;
		min-height: 50rpx;
		background: rgba(148,196,125,.15);
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #66A349;
		line-height: 50rpx;
		/* opacity: 0.15; */
		margin-top: 21rpx;
		padding: 0 31rpx;
		box-sizing: border-box;
	}
	.store_itembox {
		/* width: 100%; */
		display: flex;
		align-items: center;
		margin-top: 20rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
	}
	.store_item{
	height: 48rpx;
	background: #80C269;
	border-radius: 10rpx;
	line-height: 48rpx;
	padding: 12rpx 20rpx;
	font-size: 24rpx;
	font-family: Hiragino Sans GB;
	font-weight: 600;
	color: #FFFFFF;
	text-align: center;
	line-height: 48rpx;
	margin-right: 20rpx;
	}
	.yunfei_info{
		width: 750rpx;
		min-height: 103rpx;
		background: #FFFFFF;
		margin-top: 20rpx;
		overflow: hidden;
	}
	.yunfei_infoT{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 40rpx;
		margin-top: 16rpx;
		margin-left: 30rpx;

	}
	.yunfei_infoB{
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF7200;
		line-height: 40rpx;
		margin-left: 30rpx;
	}
	.shops_detailbox{}
	
	.videobox{
		width: 750rpx;
		height: 350rpx;
		margin-top: 30rpx;
		
	}
	.myVideo{
		width: 100%;
		height: 100%;
	}
	
	
	.shops_detailtitle{
		height: 54rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.shops_detailtitleL{
		width: 93rpx;
		height: 2rpx;
		background: #999;
		margin-right: 10rpx;
		margin-left: 10rpx;
	}
	.shops_detailtitleR{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
		line-height: 45rpx;
	}
	.line_img{
		width: 100%;
		height: 100%;
	}
	.shops_detail_imgs{
		width: 100%;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		padding: 0 20rpx;
		box-sizing: border-box;
		/* margin-top: 12rpx; */
	}
	.shopdetail_bottom1{
		width: 100%;
		height: 108rpx;
	}
	.shopdetail_bottom{
		width: 100%;
		height: 98rpx;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		position: fixed;
		bottom: 0;
		justify-content: space-between;
	}
	.store_box{
		width: 80rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		/* margin-left: 30rpx; */
	}
	.store_boxicon{
		width: 32rpx;
		height: 32rpx;
		/* background: #000; */
	}
	.store_boxtxt{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-top: 10rpx;
		/* line-height: 45rpx; */
	}
	.kefubox{
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		/* margin-left: 38rpx; */
	}
	.kefuboxicon{
		width: 39rpx;
		height: 31rpx;
		/* background: #000; */
	}
	.kefuboxtxt{
		font-size: 24rpx;
		line-height: 32rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		margin-top: 10rpx;
	}
	.cartbox{
		display: flex;
		align-items: center;
		/* margin-left: 58rpx; */
	}
	.cartboxL{
		width: 154rpx;
		height: 64rpx;
		background: #FF9A00;
		border-radius: 32rpx 0rpx 0rpx 32rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 64rpx;
		text-align: center;
		position: relative;
	}
	.cart_icon{
			width: 28rpx;
			height: 28rpx;
			background: #FF0000;
			border-radius: 14rpx;
			font-size: 22rpx;
			font-family: Hiragino Sans GB;
			font-weight: normal;
			color: #FFFFFF;
			line-height: 28rpx;
			text-align: center;
			position: absolute;
			top: 5rpx;
			right: 5rpx;
	}
	.cartboxR{
		width: 154rpx;
		height: 64rpx;
		background: #EF0E6C;
		border-radius: 0rpx 32rpx 32rpx 0rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 64rpx;
		text-align: center;
		margin-right: 20rpx;
	}
	.pintuan{
		width: 154rpx;
		height: 64rpx;
		background: #FF0000;
		border-radius: 32rpx;
		font-size: 34rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FFFFFF;
		line-height: 64rpx;
		text-align: center;
		/* margin-left: 20rpx; */
		margin-right: 20rpx;
	}
		
	.popupbox{
		width: 100%;
		height: 100%;
	}
	.popupbox_top{
		width: 100%;
		height: 268rpx;
		background: #fff;
		display: flex;
		align-items: center;
		/* justify-content: space-between; */
	}
	.popupbox_topL{
		width: 200rpx;
		height: 200rpx;
		background: #EEEEEE;
		border-radius: 20rpx;
		box-sizing: border-box;
		margin: 0 30rpx;
	}
	.popupbox_topL1{
		width: 100%;
		height: 100%;
	}
	.popupbox_topR{
		/* margin-left: 30rpx; */
	}
	.popupbox_topRtitle{
		width: 320rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 40rpx;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
	.popupbox_topRtxt{
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #999999;
		line-height: 40rpx;
		margin-top: 18rpx;
	}
	.popupbox_topRbottom{
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 56rpx;
	}
	.popupbox_topRbottomprice{
		font-size: 24rpx
	}
	.popupbox_topRbottomL{
		font-size: 36rpx;
		font-family: Hiragino Sans GB;
		font-weight: 700;
		color: #FF0000;
		line-height: 40rpx;
	}
	.popupbox_topRNUM{
		display: flex;
		align-items: center;
	}
	.cart_reduce{
		width: 52rpx;
		height: 42rpx;
		border: 2rpx solid #bbb;
		border-radius: 20rpx 0rpx 0rpx 20rpx;
		font-size: 36rpx;
		line-height: 42rpx;
		text-align: center;
		color: #bbb;
	}
	.cart_input{
		width: 62rpx;
		height: 42rpx;
		border-top: 2rpx solid #bbb;
		border-bottom: 2rpx solid #bbb;
		text-align: center;
		line-height: 42rpx;
	}
	.cart_add{
		width: 52rpx;
		height: 42rpx;
		border: 2rpx solid #bbb;
		border-radius: 0rpx 20rpx 20rpx 0rpx;
		color: #999;
		line-height: 42rpx;
		text-align: center;
	}
	.num_input{
		width: 62rpx;
		height: 42rpx;
	}
	.popup_kong{
		width: 100%;
		height: 20rpx;
		background: #EEEEEE;
	}
	.changestylebox{
		width: 100%;
	}
	.change_boxtop{
		height: 64rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 64rpx;
		margin-left: 30rpx;
	}
	.line{
		width: 644rpx;
		height: 2rpx;
		border: 1px solid #EEEEEE;
		margin-left: 30rpx;
		box-sizing: border-box;
	}
.changebox{
	/* height: 420rpx; */
	margin-left: 30rpx;
	/* overflow: hidden; */
}
	.changeboxitem{
		/* min-width: none; */
		height: 48rpx;
		background: #EEEEEE;
		border-radius: 10rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 48rpx;
		padding: 12rpx 21rpx;
		margin-top: 20rpx;
		/* box-sizing: border-box; */
		text-align: center;
		width:fit-content;
		width:-webkit-fit-content;
		width:-moz-fit-content;
	}
	.changeboxitem_active{
		height: 48rpx;
		background: #FFFFFF;
		border: 1px solid #FF0000;
		border-radius: 10rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0000;
		line-height: 48rpx;
	}
	.change_psbox{
		margin-top: 20rpx;
		display: flex;
		margin-left: 30rpx;
	}
	.change_ps{
/* 		width: 133rpx; */
		height: 48rpx;
		background: #EEEEEE;
		border-radius: 10rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #333333;
		line-height: 48rpx;
		text-align: center;
		padding: 12rpx 20rpx;
		margin-right: 20rpx;
		/* box-sizing: border-box; */
	}
	.change_ps_active{
		background: #FFFFFF;
		border: 1px solid #FF0000;
		border-radius: 10rpx;
		height: 49rpx;
		font-size: 24rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FF0000;
		line-height: 48rpx;
	}
	.changebtn{
		width: 690rpx;
		height: 88rpx;
		background: #EF0E6C;
		border-radius: 44rpx;
		margin: 0 auto;
		margin-top: 60rpx;
		font-size: 28rpx;
		font-family: Hiragino Sans GB;
		font-weight: normal;
		color: #FFFFFF;
		line-height: 88rpx;
		text-align: center;
		/* margin-bottom: 32rpx; */
	}
	.changebtnbottom{
		width: 100%;
		height: 32rpx;
	}
	.content_setup{
/* 		width: 160rpx;
		height: 120rpx; */
		/* height: 98rpx; */
		/* width: 120rpx; */
		line-height: 98rpx;
		display: flex;
		flex-direction:column;
		align-items: center;
		justify-content: flex-end;
		background: transparent;
		/* justify-content: space-between; */
		/* margin-top: 40rpx; */
		
	}
	button::after{
		border:none;
		background-color:none;
		margin: 0;
		padding: 0;
		/* border-radius:0; */
	}
</style>